<!--非系统开闸-->
<template>
  <div class="common-body-wrapper">
    <search-header
      single-width="130"
      :searchList="searchList"
      @changeHeight="toRetTable"
      @confirmSearch="toSearch"
      :isCheckbox="true"
      :isNeedTree="true"
      :paramName="paramName"
      @setSelectedNode="setSelectedNode"
    ></search-header>
    <div class="common-table-tree-wrapper">
      <div class="common-table-wrapper">
        <multi-fun-table
          :sortColumn="notFormatColumn"
          :orderType="sortType"
          :fixed-cols="fixedCols"
          :is-reset-table="isResetTable"
          :theads-info="theadsInfo"
          :tbodys-info="tbodysInfo"
          @handleMultiCheck="handleMultiCheck"
          @handleSortColumn="handleSortColumn"
          @searchFn="getList"
          @getNextPage="getNextPage"
        >
          <div class="operate-btn-group" slot="operateBtnGroup">
            <a
              class="ake_btn ake_btn_text"
              v-if="isPermmited('PARKING_OPERATION:PARK_ABNORMAL_OPEN_GATE_CAR:EXPORT')"
              @click.prevent="exportData()"
            >导出</a>
          </div>
          <template slot="tdCell" slot-scope="props">
            <el-table-column
              :fixed="props.fixed"
              :label="props.label"
              :min-width="props.minWidth"
              :width="props.width"
              :prop="props.prop"
              :sortable="props.sortable"
            >
              <template slot-scope="scope">
                <span v-if="'reno' == props.prop">{{scope.$index+1}}</span>
                <span v-else-if="'carNoImageUrl' == props.prop">
                  <span v-if="!scope.row['carNoImageUrl'] && !scope.row['carImageUrl']">暂无图片</span>
                  <a
                    v-else-if="!scope.row[props.prop] && scope.row['carImageUrl']"
                    class="imgLink"
                    @click="showBigImgModal('bigPicModal', scope.row['carImageUrl'])"
                  >查看大图</a>
                  <a v-else-if="scope.row[props.prop] && !scope.row['carImageUrl']" class="imgLink">
                    <img
                      class="carNoImageUrl"
                      style="width: 60px;height:30px;"
                      alt="无缩略图"
                      :src="scope.row['carNoImageUrl']"
                      @error="handleImg($event,scope.row)"
                    />
                  </a>
                  <a
                    v-else
                    class="imgLink"
                    @click="showBigImgModal('bigPicModal', scope.row['carImageUrl'])"
                  >
                    <img
                      class="carNoImageUrl"
                      style="width: 60px;height:30px;"
                      alt="无缩略图"
                      :src="scope.row['carNoImageUrl']"
                      @error="handleImg($event,scope.row)"
                    />
                  </a>
                  <img
                    class="carImageUrl"
                    style="width: 60px;height:30px;display:none"
                    alt="暂无图片"
                    :src="scope.row['carImageUrl']"
                    @error="handleImg($event,scope.row)"
                  />
                </span>
                <span
                  class="row-href"
                  v-else-if="'carCode'==props.prop && (scope.row.supportVirtualCarcode || scope.row[props.prop].indexOf('智')>-1)"
                  @click.prevent="checkBindingCarCode(scope.row,'bindingCarCodeModal')"
                >{{ scope.row[props.prop] }}</span>
                <span v-else>{{ scope.row[props.prop] }}</span>
              </template>
            </el-table-column>
          </template>
        </multi-fun-table>

        <table-pagination :size="total" :cur-page="pageNumber" @backData="getPagination"></table-pagination>
      </div>
    </div>

    <big-pic-modal ref="bigPicModal">
      <img
        slot="bigImgSlot"
        :src="bigImgPath | setImgPath"
        alt
        @error="imgError('../../', 'car', $event)"
      />
    </big-pic-modal>
  </div>
</template>

<script>
import common from "@mixins/common.js";
import stardardList from "@mixins/tables/stardardList.js";

//modal
import invokeModal from "@mixins/modal/invokeModal.js";
import BigPicModal from "@components/widgets/BigPicModal.vue";

// image
import images from "@mixins/image.js";

// 引进vue的js
import park_abnormal_open_gate_car from "./js/park_abnormal_open_gate_car.js";

export default {
  name: "parkAbnormalOpenGateCar",
  mixins: [
    common,
    stardardList,
    invokeModal,
    images,
    park_abnormal_open_gate_car
  ],
  components: {
    BigPicModal
  },
  data() {
    const today = [
      new Date(moment().format("YYYY-MM-DD 00:00:00")),
      new Date(moment().format("YYYY-MM-DD 23:59:59"))
    ];

    return {
      fixedCols: 3,
      total: 0,
      paramName: "parkIds",
      //prop-返回数据的字段名称   proisNotInter:true,pNameisNotInter:true,，name-查询字段传参名称    text-显示名称  //initHidden  初始化不显示
      searchList: [
        {
          type: "text",
          isShow: false,
          name: "channelName",
          text: "通道名称",
          value: ""
        },
        // { type: 'text', isShow: false, name: 'carCode', text: '车牌号码', value: '' },
        {
          //复合型输入框
          isShow: false,
          type: "mixedInput",
          name: "carCode",
          text: "",
          value: "carCode",
          inputVal: "",
          style: { width: "70px" },
          isHandleChange: true,
          btnFlag: "logicCardCode",
          options: [
            { name: "车牌号", value: "carCode" },
            { name: "逻辑卡号", value: "logicCardCode" },
            { name: "卡面号码", value: "faceCardCode" },
            { name: "卡票号", value: "cardCode" } //卡号
          ]
        },
        // { type: 'text', isShow: false, name: 'cardCode', text: '卡号', value: '' },
        {
          type: "datePicker",
          isShow: false,
          name: "query_time",
          text: "开闸时间",
          propName: "timeFrom,timeTo",
          value: today,
          style: { width: "360px" }
        },
        {
          type: "select",
          isShow: false,
          name: "recordType",
          text: "通道类型",
          value: "",
          options: [
            { name: "全部", value: "" },
            { name: "进场通道", value: "1" },
            { name: "离场通道", value: "2" }
          ]
        },
        {
          type: "select",
          isShow: false,
          name: "openGateType",
          text: "开闸类型",
          value: "",
          options: [
            { name: "全部", value: "" },
            { name: "未确认", value: "0" },
            { name: "遥控开闸", value: "1" },
            { name: "可疑跟车", value: "2" }
          ]
        }
      ],
      theadsInfo: [
        // { index: 0, isShow: false, prop: 'reno', text: '序号', width: 64 },
        {
          index: 1,
          isShow: false,
          prop: "carNoImageUrl",
          text: "车牌图片",
          sortable: true,
          minWidth: 50
        },
        {
          index: 2,
          isShow: false,
          prop: "carCode",
          text: "车牌号",
          sortable: true,
          minWidth: 50
        },
        {
          index: 3,
          isShow: false,
          prop: "cardCode",
          text: "卡号",
          sortable: true,
          minWidth: 50
        },
        {
          index: 4,
          isShow: false,
          prop: "openGateTypeStr",
          text: "开闸类型",
          sortable: true,
          minWidth: 50
        },
        {
          index: 5,
          isShow: false,
          prop: "parkName",
          text: "停车场",
          sortable: true,
          minWidth: 50
        },
        {
          index: 6,
          isShow: false,
          prop: "inOutTime",
          text: "开闸时间",
          sortable: true,
          minWidth: 80
        },
        {
          index: 7,
          isShow: false,
          prop: "recordTypeStr",
          text: "通道类型",
          sortable: true
        },
        {
          index: 8,
          isShow: false,
          prop: "channelName",
          text: "通道名称",
          sortable: true,
          minWidth: 50
        },
        {
          index: 9,
          isShow: false,
          prop: "shouldChargeValue",
          text: "应收",
          sortable: true
        },
        {
          index: 10,
          isShow: false,
          prop: "realChargeValue",
          text: "实收",
          sortable: true
        },
        {
          index: 11,
          isShow: false,
          prop: "reliefChargeValue",
          text: "优惠",
          sortable: true
        },
        {
          index: 12,
          isShow: false,
          prop: "balance",
          text: "差额",
          sortable: true
        }
      ],
      tbodysInfo: []
    };
  },
  methods: {}
};
</script>

<style lang="less" scoped>
</style>
